<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>[title]</title>

    <!-- Bootstrap core CSS -->
    <link href="__PUBLIC__/template/css/bootstrap.css" rel="stylesheet">

    <!-- Add custom CSS here -->
    <link href="__PUBLIC__/template/css/sb-admin.css" rel="stylesheet">
    <link rel="stylesheet" href="__PUBLIC__/template/font-awesome/css/font-awesome.min.css">
    <script type="text/javascript" src="__PUBLIC__/js/jquery.js"></script>
    <script type="text/javascript" src="__PUBLIC__/js/ajaxRBAC.js"></script>
    <style type="text/css">
        .loading{
            width: 40px;
            height: 40px;
            display: none;
        }
    </style>
</head>

<body>
<div id="page-wrapper">
    
    <div class="row">
        <div class="col-md-6">
            <a href="{:U('Rbac/addRole')}" id="addRole" class="btn btn-success">添加角色or权限</a>

        </div>
        <div class="col-md-6">
            <form action="{:U('category/index')}" method="post">
                <div class="form-group input-group">
                    <input type="text" class="form-control" name="key" placeholder="输入分类标题或者别名关键词搜索">
                    <span class="input-group-btn">
                      <button class="btn btn-default" type="submit"><i class="fa fa-search"></i></button>
                    </span>
                </div>
            </form>
        </div>
    </div>
    <h3>角色列表</h3>
    <table class="table table-hover table-striped" style="width: 500px;float: left;">
        <thead>
            <tr>
                <th>序号</th>
                <th>节点名称</th>
                <th>操作</th>
            </tr>
        </thead>
        <tbody>
        <!-- tp遍历二维数组volist比foreach好用! -->
            <foreach name="role" key="k" item="v">
            <!-- 索引index不要用v.id,数组有被删除,用键名key -->
                <tr>
                    <td>{$k+1}</td>
                    <td>
                        <input type="text" class="roleName" name="rolename" value="{$v.rolename}" index="{$k}" />
                        <input type="hidden" class="roleId" name="id" value="{$v.id}" index="{$k}" />
                        <img src="__PUBLIC__/images/RBAC/loading.gif" class="loading" index="{$k}" />
                    </td>
                    <!-- 删除节点 -->
                    <td><a href="javascript:;" class="updateRole" index="{$k}">修改</a> | <a href="{:U('Access/delete',array('id'=>$v[id],'type'=>'role'))}" style="color:red;" onclick="javascript:return del('您真的确定要删除吗？\n\n将删除与此角色关联的所有节点!!\n\n慎重!! 删除后将不能恢复!');">
                    删除角色</a></td>
                    <!-- ※※※记住这个传id的前端写法※※※ -->
                </tr>
            </foreach>
        </tbody>
    </table>
    <h3 style="position:absolute;top:150px;right:810px">权限列表</h3>
    <table class="table table-hover table-striped" style="width: 500px;float: left;margin-left:100px;">
        <thead>
            <tr>
                <th>序号</th>
                <th>节点名称 (改值即可修改)</th>
                <th>操作</th>
            </tr>
        </thead>
        <tbody>
        <!-- tp遍历二维数组volist比foreach好用! -->
            <foreach name="perm" key="k" item="v">
                <tr>
                    <td>{$k+1}</td>
                    <td>
                        <input type="text" class="permName" name="permname" value="{$v.permname}" onblur="updatePerm({$v.id},this.value,{$k})">
                        <!-- <input type="text" class="permName" name="permname" value="{$v.permname}" onblur="updatePerm(<?php echo $v['id']?>,this.value,<?php echo $k?>,$jqAllArr)" /> -->
                    </td>
                    <!-- 删除节点 -->
                    <td><a href="{:U('Access/delete',array('id'=>$v[id],'type'=>'perm'))}" style="color:red;" onclick="javascript:return del('您真的确定要删除吗？\n\n将删除所有节点里的此权限\n\n删除后将不能恢复!');">删除权限</a></td>
                </tr>
            </foreach>
        </tbody>
    </table>

   
    <a href="{:U('Access/add_node')}" class="btn btn-success" style="position:relative;top:250px;right:1100px">添加节点</a>
    <h3 style="position:relative;top:250px;right:1100px">节点列表</h1>
    <table class="table table-hover table-striped" style="margin-top: 250px">
        <thead>
            <tr>
                <th>序号</th>
                <th>节点名称</th>
                <th>角色名称</th>   <!-- 实际上就是权限名 -->
                <th>权限名称</th>   <!-- 一个节点代表一个权限 -->
                <th>操作</th>
            </tr>
        </thead>
        <tbody>
        <!-- tp遍历二维数组volist比foreach好用! -->
            <volist name="role_to_perm" key="rk" id="rv">
                <volist name="rv['role_to_permission']" key="k" id="v">
                    <tr>
                        <td>{$nodeNum}</td>
                        <td>
                            <input type="text" class="nodeName" name="nodename" value="{$v.nodename}" />
                            <!-- 节点的修改留给志伟的样式 -->
                            <input type="hidden" class="nodeId" name="id" value="{$v.id}" />
                            <img src="__PUBLIC__/images/RBAC/loading.gif" class="loading" />
                        </td>
                        <td class="oppositeRolename">{$rv.rolename}</td>
                        <td class="oppositePermname" id="oppositePermname{$rk+$k-2}">{$v.permname}</td>
                        <!-- 删除节点 -->
                        <td><a href="{:U('Access/delete',array('perm_id'=>$v[id],'role_id' =>$rv['id'],'type'=>'node'))}" style="color:red;" onclick="javascript:return del('您真的确定要删除吗？\n\n删除后将不能恢复!');">删除节点</a></td>
                    </tr>
                    <php>$nodeNum++;</php>
                </volist>
            </volist>
        </tbody>
    </table>
    {$page}
</div>
<script src="__PUBLIC__/template/js/jquery-1.10.2.js"></script>
<script src="__PUBLIC__/template/js/bootstrap.js"></script>
<script src="__PUBLIC__/template/js/app.js"></script>

</body>
</html>
</body>
</html>